<template>
	<div class="container">
		<div class="box">
			<div class="title">天翼云采集服务</div>
			<div class="msg">
				<div>
					<h3>采集服务信息</h3>
				</div>
				<el-row>
					<el-col :span="6">
						创建时间:
						<span>FZ1028DC</span>
					</el-col>
					<el-col :span="6">
						启动时间:
						<span>2028-12-25 15:35:30</span>
					</el-col>
					<el-col :span="6">
						运行标志：
						<span>运行</span>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="6">
						服务唯一号：
						<span>FZ1028DC</span>
					</el-col>
					<el-col :span="6">
						IP：
						<span>192.168.1.165</span>
					</el-col>
					<el-col :span="6">
						主机名：
						<span>FZSE555567</span>
					</el-col>
				</el-row>
			</div>
			<div class="add">
				<el-button type="primary">新增任务</el-button>
			</div>
			<div>
				<el-table :data="tableData" style="width: 100%" :stripe="true">
					<el-table-column type="expand">
						<template slot-scope="props">
							<h3>展开列表</h3>
						</template>
					</el-table-column>
					<el-table-column label="序号" type="index"></el-table-column>

					<el-table-column label="操作" prop="id"></el-table-column>

					<el-table-column label="任务名称" prop="id"></el-table-column>
					<el-table-column label="任务状态" prop="id"></el-table-column>
					<el-table-column label="触发类型" prop="id"></el-table-column>
					<el-table-column label="任务描述" prop="id"></el-table-column>
					<el-table-column label="触发时间" prop="id"></el-table-column>
					<el-table-column label="创建人" prop="desc"></el-table-column>
				</el-table>
			</div>
		</div>
		<div class="aliyun">
			<div class="title">阿里云采集服务</div>
			<div class="msg">
				<div>
					<h3>采集服务信息</h3>
				</div>
				<el-row>
					<el-col :span="6">
						创建时间:
						<span>FZ1028DC</span>
					</el-col>
					<el-col :span="6">
						启动时间:
						<span>2028-12-25 15:35:30</span>
					</el-col>
					<el-col :span="6">
						运行标志：
						<span>运行</span>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="6">
						服务唯一号：
						<span>FZ1028DC</span>
					</el-col>
					<el-col :span="6">
						IP：
						<span>192.168.1.165</span>
					</el-col>
					<el-col :span="6">
						主机名：
						<span>FZSE555567</span>
					</el-col>
				</el-row>
			</div>
		</div>
	</div>
</template>

<script>
import myTable from '@/components/myTable'
export default {
	components: { myTable },
	data () {
		return {
			tableData: [ {
				id: '12987122',
				name: '好滋好味鸡蛋仔',
				category: '江浙小吃、小吃零食',
				desc: '荷兰优质淡奶，奶香浓而不腻',
				address: '上海市普陀区真北路',
				shop: '王小虎夫妻店',
				shopId: '10333',
			},
			{
				id: '12987123',
				name: '好滋好味鸡蛋仔',
				category: '江浙小吃、小吃零食',
				desc: '荷兰优质淡奶，奶香浓而不腻',
				address: '上海市普陀区真北路',
				shop: '王小虎夫妻店',
				shopId: '10333',
			},
			{
				id: '12987125',
				name: '好滋好味鸡蛋仔',
				category: '江浙小吃、小吃零食',
				desc: '荷兰优质淡奶，奶香浓而不腻',
				address: '上海市普陀区真北路',
				shop: '王小虎夫妻店',
				shopId: '10333',
			},
			{
				id: '12987126',
				name: '好滋好味鸡蛋仔',
				category: '江浙小吃、小吃零食',
				desc: '荷兰优质淡奶，奶香浓而不腻',
				address: '上海市普陀区真北路',
				shop: '王小虎夫妻店',
				shopId: '10333',
			} ],
		}
	},
	computed: {},
	created () {

	},
	mounted () {

	},
	methods: {},
}
</script>

<style scoped lang="less">
.container {
	.title {
		height: 50px;
		line-height: 50px;
		color: #333;
		background-color: #f5f5f5;
		border-bottom: 1px solid #ddd;
		padding-left: 20px;
	}
	.msg {
		padding-top: 20px;
		border: 1px solid #ddd;
		height: 148px;
		padding-left: 20px;
		.el-row {
			line-height: 45px;
		}
	}
	.box {
		border: 1px solid #ddd;
		width: 100%;
		// padding-left: 20px;

		.add {
			text-align: right;
			margin: 10px 0;
		}
	}
	.aliyun {
		margin-top: 30px;
		border-bottom: 1px solid #ddd;
	}
}
</style>
